
<!--具体的商品，服务-->

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>餐饮服务</title>
</head>
<link href="CSS/HomePage.css" type="text/css" rel="stylesheet">
<link href="CSS/jquery-ui.min.css" type="text/css" rel="stylesheet">
<link href="CSS/owl.carousel.min.css" rel="stylesheet" type="text/css">
<link href="CSS/list.css" rel="stylesheet" type="text/css">

<script type="text/javascript" src="js/jquery-3.6.0.js"></script>
<script type="text/javascript" src="js/jquery-1.12.1.min.js"></script>
<script type="text/javascript" src="js/jquery.cookie.js"></script>
<script type="text/javascript" src="js/jquery-ui.min.js"></script>
<script type="text/javascript" src="js/jquery.pagination.js"></script>
<script src="js/axios-0.18.0.js"></script>
<script src="js/catering.js"></script>

<body>
<script>
    if (sessionStorage.getItem('isLogined')!='true'){
        alert('请先登录！');
        window.location.href='Login_Custom.html';
    }
</script>
<div class="pg1">
    <div class="pg">
        <div class="pg_top">
            <div class="logo">
                <div class="lg"><img src="images/logopic.jpg" alt="香格里拉酒店" title="香格里拉酒店"></div>
                <div class="star">&nbsp;★★★★★</div>
            </div>
            <div class="htitle">
                <h1>香格里拉酒店</h1></br>
                <span class="htitleEn">ShANGRI-LA Business Hotel </span>
            </div>
            <div class="htopr">
                <div class="registe">
                    </br>
                    <a href="Register.html">注册</a>
                    <a href="Login_Custom.html">&nbsp;&nbsp;退出登录&nbsp;</a>
                </div>
                <br><br>
                <br>
                <div class="address">地址：南京市玄武区孝陵卫XXX号XXX街道</div>
                <div class="address" style="font-weight: bold"></div>
            </div>
        </div>
        <div class="menu">
            <ul class="clear">
                <li class="issues"></li>
                <li>
                    <a href="HomePage.html">首&nbsp;&nbsp;页</a>
                </li>
                <li class="issues"></li>
                <li>
                    <a href="rooms.html">客房预订</a>
                </li>
                <li class="issues"></li>
                <li>
                    <a href="catering.html">餐饮服务</a>
                </li>
                <li class="issues"></li>
                <li>
                    <a href="leaving.html">退房办理</a>
                </li>
                <li class="issues"><li>
                <li>
                    <a href="Aboutus.html">关于我们</a>
                </li>
            </ul>
        </div>
    </div>
</div>
<div class="pg">
    <div class="hc">
        <div class="hcl">
            <div class="pict">
                <div class="l01t">客房预订流程</div>
                <div class="pictpic">
                    <img src="images/procedure.jpg">
                </div>
            </div>
        </div>
        <div class="hcr1">
            <div class="r01">
                <div class="r01l">在线订购</div><span class="enlm">Ordering Online</span>
                <div class="r01r">
                    <a href="HomePage.html.html">首页</a> &gt; 在线订购</div>
            </div>
            <div class="r02">
                <table>
                   <tr>
                       <td>
                           以下为本店为您提供的各类饮食烟酒服务，请您随意挑选
                       </td>
                       <td>
                           &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                           &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                           &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                           <a href="leaving.html">点击!查看您的消费</a>
                       </td>
                   </tr>
                </table>
            </div>

<!--      数据交互      -->
        <table id="tablelist" onclick="getSelectLine()">
            <thead>
            <tr>
                <th>
                    <input name="checkAll" type="checkbox" id="checkAll" />选择
                </th>
                <th>参考图片</th>
                <th>餐品名称</th>
                <th>餐品类别</th>
                <th>数量</th>
                <th>单价(元)</th>
            </tr>
            </thead>
            <tbody id="tablelistbody">
            <tr>
                <td><input name="checkItem" type="checkbox" value=""></td>
                <td class="imgtd"><img src="images/img1.jpg" style="margin-top: 10px;  position: relative; height: 30px; width: 80%"></td>
                <td>激情椒麻鱼</td>
                <td>餐饮类</td>
                <td><input type="number" name="num1" id="fish" class="number_input" min="0"></td>
                <td>38.9</td>
            </tr>
            <tr class="odd">
                <td><input name="checkItem" type="checkbox" value=""></td>
                <td class="imgtd"><img src="images/img2.jpg" style="margin-top: 10px;  position: relative; height: 30px; width: 80%"></td>
                <td>干锅花菜</td>
                <td>餐饮类</td>
                <td><input type="number" name="num2" id="hc" class="number_input" min="0"></td>
                <td>36</td>
            </tr>
            <tr>
                <td><input name="checkItem" type="checkbox" value=""></td>
                <td class="imgtd"><img src="images/img3.jpg" style="margin-top: 10px;  position: relative; height: 30px; width: 80%"></td>
                <td>有机鱼头泡饭</td>
                <td>餐饮类</td>
                <td><input type="number" name="num3" id="fd" class="number_input" min="0"></td>
                <td>148</td>
            </tr>
            <tr class="odd">
                <td><input name="checkItem" type="checkbox" value=""></td>
                <td class="imgtd"><img src="images/img4.jpg" style="margin-top: 10px;  position: relative; height: 30px; width: 80%"></td></td>
                <td>招牌风味鸭舌</td>
                <td>餐饮类</td>
                <td><input type="number" name="num4" id="ys" class="number_input" min="0"></td>
                <td>38</td>
            </tr>
            <tr>
                <td><input name="checkItem" type="checkbox" value=""></td>
                <td class="imgtd"><img src="images/img5.jpg" style="margin-top: 10px;  position: relative; height: 30px; width: 80%"></td>
                <td>石锅脆肠</td>
                <td>餐饮类</td>
                <td><input type="number" name="num5" id="cc" class="number_input"  min="0"></td>
                <td>69.9</td>
            </tr>
            <tr class="odd">
                <td><input name="checkItem" type="checkbox" value=""></td>
                <td class="imgtd"><img src="images/img6.jpg" style="margin-top: 10px;  position: relative; height: 30px; width: 80%"></td></td>
                <td>可乐</td>
                <td>饮料类</td>
                <td><input type="number" name="num6" id="cola" class="number_input" min="0"></td>
                <td>7</td>
            </tr>
            <tr>
                <td><input name="checkItem" type="checkbox" value=""></td>
                <td class="imgtd"><img src="images/img7.jpg" style="margin-top: 10px;  position: relative; height: 30px; width: 80%"></td></td>
                <td>雪碧</td>
                <td>饮料类</td>
                <td><input type="number" name="num7" id="xb" class="number_input" min="0"></td>
                <td>8</td>
            </tr>
            <tr class="odd">
                <td><input name="checkItem" type="checkbox" value=""></td>
                <td class="imgtd"><img src="images/img8.jpg" style="margin-top: 10px;  position: relative; height: 30px; width: 80%"></td></td>
                <td>果汁</td>
                <td>饮料类</td>
                <td><input type="number" name="num8" id="juice" class="number_input" min="0"></td>
                <td>7</td>
            </tr>
            <tr>
                <td><input name="checkItem" type="checkbox" value=""></td>
                <td class="imgtd"><img src="images/img9.jpg" style="margin-top: 10px;  position: relative; height: 30px; width: 80%"></td></td>
                <td>椰汁</td>
                <td>饮料类</td>
                <td><input type="number" name="num9" id="yz" class="number_input" min="0"></td>
                <td>10</td>
            </tr>
            <tr class="odd">
                <td><input name="checkItem" type="checkbox" value=""></td>
                <td class="imgtd"><img src="images/img10.jpg" style="margin-top: 10px;  position: relative; height: 30px; width: 80%"></td></td>
                <td>中华</td>
                <td>烟酒类</td>
                <td><input type="number" name="num10" id="huazi" class="number_input" min="0"></td>
                <td>50</td>
            </tr>
            <tr>
                <td><input name="checkItem" type="checkbox" value=""></td>
                <td class="imgtd"><img src="images/img11.jpg" style="margin-top: 10px;  position: relative; height: 30px; width: 80%"></td></td>
                <td>大熊猫</td>
                <td>烟酒类</td>
                <td><input type="number" name="num11" id="bigpa" class="number_input" min="0"></td>
                <td>100</td>
            </tr>
            <tr class="odd">
                <td><input name="checkItem" type="checkbox" value=""></td>
                <td class="imgtd"><img src="images/img12.jpg" style="margin-top: 10px;  position: relative; height: 30px; width: 80%"></td></td>
                <td>小熊猫</td>
                <td>烟酒类</td>
                <td><input type="number" name="num12" id="tinypa" class="number_input" min="0"></td>
                <td>200</td>
            </tr>
            <tr>
                <td><input name="checkItem" type="checkbox" value=""></td>
                <td class="imgtd"><img src="images/img13.jpg" style="margin-top: 10px;  position: relative; height: 30px; width: 80%"></td></td>
                <td>茅台</td>
                <td>烟酒类</td>
                <td><input type="number" name="num13" id="mt" class="number_input" min="0" ></td>
                <td>3000</td>
            </tr>
            <tr class="odd">
                <td><input name="checkItem" type="checkbox" value=""></td>
                <td class="imgtd"><img src="images/img14.jpg" style="margin-top: 10px;  position: relative; height: 30px; width: 80%"></td></td>
                <td>五粮液</td>
                <td>烟酒类</td>
                <td><input type="number" name="num14" id="wly" class="number_input" min="0"></td>
                <td>300</td>
            </tr>
            <tr>
                <td><input name="checkItem" type="checkbox" value=""></td>
                <td class="imgtd"><img src="images/img15.jpg" style="margin-top: 10px;  position: relative; height: 30px; width: 80%"></td></td>
                <td>洗脚</td>
                <td>服务类</td>
                <td><input type="number" name="num15" id="ft" class="number_input" min="0"></td>
                <td>88</td>
            </tr>
            <tr class="odd">
                <td><input name="checkItem" type="checkbox" value=""></td>
                <td class="imgtd"><img src="images/img15.jpg" style="margin-top: 10px;  position: relative; height: 30px; width: 80%"></td></td>
                <td>spa</td>
                <td>服务类</td>
                <td><input type="number" name="num16" id="spa" class="number_input" min="0"></td>
                <td>268</td>
            </tr>
            </tbody>
        </table>
            <script type="text/javascript">
                $(function() {
                    var $table = $("#tablelist"),
                        currentPage = 0;
                    var pageSize = 6;
                    $table.bind('paging', function () {
                        $table.find('tbody tr').hide().slice(currentPage * pageSize, (currentPage + 1) * pageSize).show();
                    });
                    var sumRows = $table.find('tbody tr').length;
                    var sumPages = Math.ceil(sumRows / pageSize);
                    var $pager = $("<div class='pagin'></div>");
                    for (var pageindex = 0; pageindex < sumPages; pageindex++) {
                        //为页标签加上链接
                        $('<a href="#"><span>' + (pageindex + 1) + '</span></a>').bind('click', {"newpage": pageindex}, function (event) {
                            currentPage = event.data["newpage"];
                            $table.trigger('paging');
                        }).appendTo($pager);

                        $pager.append(' ');
                    }
                    $pager.insertAfter($table);
                    $table.trigger('paging');
                })
            </script>
        </div>
        <div class="room_c">
            <input class="room_input" type="text" name="rm" id="rm" placeholder="输入房间号(必须输入)">
        </div>
        <div class="book1">
            <input type="button" class="btn" value="确定预订" id="buttonHandle">
        </div>
    </div>
</div>

<div class="pg2">
    <div class="pg">
        <div class="foot">
            <a href="HomePage.html.html" title="香格里拉酒店">网站首页</a> |
            <a href="Aboutus.html.html" title="关于我们">关于我们</a> Copyright @ ShanggerilaHotel.cn All rights reserved<br /> 香格里拉酒店　Shanggerila Business Hotel ICP备11101838号
        </div>
    </div>
</div>
</body>
</html>